<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- layui的核心css-->
    <link rel="stylesheet" href="../css/layui.css">
    <!-- layui的核心js-->
    <script src="../layui.js"></script>
</head>
<body>
    <div class="layui-inline"> <!-- 注意：这一层元素并不是必须的 -->
        <input type="text" class="layui-input" id="date1">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date2">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date3">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date4">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date5">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date6">
      </div>
      <hr>
      <div class="layui-inline"> 
        <input type="text" class="layui-input" id="date7">
      </div>

    <script type="text/javascript">
        // 加载laydate模块
        layui.use('laydate', function(){
        var laydate = layui.laydate;
        // 加载laydate示例
        laydate.render({
            elem:"#date1"
              //绑定id为data1的元素
        });
        // 年
        laydate.render({
            elem:"#date2",
            type:'year'
        });

        //年月选择器
        laydate.render({ 
        elem: '#date3'
        ,type: 'month'
        });
         
        //时间选择器
        laydate.render({ 
        elem: '#date4'
        ,type: 'time'
        });
        
        //日期时间选择器
        laydate.render({ 
        elem: '#date5'
        ,type: 'datetime',
        // format:'yyyy年MM月dd日',
        format:'yyyy/MM/dd'
        });

        //传入符合format格式的字符给初始值
        laydate.render({ 
        elem: '#date6'
        ,value: '2018-08-18' //必须遵循format参数设定的格式
        });
        
        //传入Date对象给初始值
        laydate.render({ 
        elem: '#date7'
        ,value: new Date(1534766888000) //参数即为：2018-08-20 20:08:08 的时间戳
        });
      

        });
    </script>
</body>
</html>